window.onload = function () {
    var visitorLogin = document.getElementById("visitor-login");
    visitorLogin.onclick = function () {
        sessionStorage.removeItem("data")
    }
    // 记住所选择的模式
    if (!getCookie("patternFlag")) {
        setCookie("patternFlag", 1, 7);
        setSession("patternFlag", 1);
    } else {
        setSession("patternFlag", getCookie("patternFlag"));
    }
    changePattern();
    // 处于反面的页面display设置为none，目的是防止反面的输入框影响到正面的输入
    // 获取正反面标签以及label标签并存储到对应变量中
    var form = document.getElementsByClassName("form");
    var choose = document.getElementsByTagName("label")[0];
    var i = 1;
    // 设置点击响应事件
    choose.onclick = function () {
        form[i].style.display = "block";
        form[1 - i].style.display = "none";
        i = 1 - i;
    }

    //获取p，用于获得服务器响应后插入提示文字
    var L_user = document.getElementById("L_user");
    var R_phone = document.getElementById("R_phone");
    var R_user = document.getElementById("R_user");
    var R_key=document.getElementById("R_key");
    //获取含有输入信息的Input标签存入数组中，便于后续提取信息
    var content = document.getElementsByClassName("content");
    // 获取记住我的按钮
    var remeberME = document.getElementById("remeber-me");
    // 获取登录注册按钮
    var L_btn = document.getElementById("L_btn");
    var R_btn = document.getElementById("R_btn");
    if (getSession("data")) {
        if (getCookie("username")) {
            content[0].value = getCookie("username");
            content[1].value = getCookie("password");
        }
        deleteCookie("username");
        deleteCookie("password");
        remeberME.checked = false;
        L_btn.disabled = false;
    }
    // 当cookie有缓存时自动填入账号密码
    if (getCookie("username")) {
        remeberME.checked = true;
        content[0].value = getCookie("username");
        content[1].value = getCookie("password");
        L_btn.value = "为你自动登录";
        L_btn.disabled = "flase";
        choose.disabled = "flase"
        setTimeout(() => {
            ajax({
                type: 'post',
                url: 'http://www.rushmc.top/api/login',
                data: {
                    username: content[0].value,
                    password: content[1].value
                },
                header: {
                    'Content-Type': 'application/x-www-form-urlencode'
                },
                success: function (response) {
                    if (response.code == 200) {
                        L_user.style.textAlign = 'start';
                        L_user.innerHTML = response.msg + "!" + "!" + "!" + "1s后跳转个人信息页面";
                        L_user.style.color = '#61ff96';
                        setSession("data", response.data);

                        if (remeberME.checked == true) {
                            setCookie("username", content[0].value, 7);
                            setCookie("password", content[1].value, 7);
                        } else {
                            deleteCookie("username");
                            deleteCookie("password");
                        }

                        document.location = '../' + "个人信息/index2.html";

                    } else {
                        L_user.innerHTML = response.msg;
                        L_user.style.color = 'red';
                    }
                }
            })
        }, 500);
    }

    // 设置登录按钮点击响应事件
    L_btn.onclick = function () {
        ajax({
            type: 'post',
            url: 'http://www.rushmc.top/api/login',
            data: {
                username: content[0].value,
                password: content[1].value
            },
            header: {
                'Content-Type': 'application/x-www-form-urlencode'
            },
            success: function (response) {
                if (response.code == 200) {
                    L_user.style.textAlign = 'start';
                    L_user.innerHTML = response.msg + "!" + "!" + "!" + "1s后跳转个人信息页面";
                    L_user.style.color = '#61ff96';
                    setSession("data", response.data);
                    if (remeberME.checked == true) {
                        setCookie("username", content[0].value, 7);
                        setCookie("password", content[1].value, 7);
                    } else {
                        deleteCookie("username");
                        deleteCookie("password");
                        L_btn.value = "登录";
                        L_btn.disabled = "true";
                        choose.disabled = "true"
                    }
                    document.location = '../' + "个人信息/index2.html";
                } else {
                    L_user.innerHTML = response.msg;
                    L_user.style.color = 'red';
                }
            }
        })
    }
    // 设置规范电话号码的输入
    // 离开焦点时的响应事件
    content[5].onblur = function () {
        var phone = this.value;
        // 设置电话号码的正则表达式
        var reg = /^1[34578][0-9]{9}$/;
        if (!reg.test(phone)) {
            R_phone.style.color = 'red';
            R_phone.innerHTML = '请输入正确格式的电话号码！';
            return;
        } else {
            R_phone.innerHTML = '';
        }
    }
    content[3].onblur = function () {
        var key = this.value;
        // 设置密码的正则表达式
        var K_reg = /\w{6}/;
        if (!K_reg.test(key)) {
            R_key.style.color = 'red';
            R_key.innerHTML = '至少六位有效数字或字母';
            return;
        } else {
            R_key.innerHTML = '';
        }
    }
    // 设置注册按钮单击响应事件
    R_btn.onclick = function () {
        R_user.innerHTML = "";
        var phone = content[5].value;
        var key = content[3].value;
        // 设置电话号码和密码的正则表达式
        var reg = /^1[34578][0-9]{9}$/;
        var K_reg = /\w{6}/;
        if (!reg.test(phone)||!K_reg.test(key)) {
            return;
        }
        
        ajax({
            type: 'post',
            url: 'http://www.rushmc.top/api/register',
            data: {
                username: content[2].value,
                password: content[3].value,
                name: content[4].value,
                phone: content[5].value
            },
            header: {
                'Content-Type': 'application/x-www-form-urlencode'
            },
            success: function (response) {
                R_user.style.textAlign = 'center';
                R_user.innerHTML = response.msg;
                if (response.code == 200) {
                    R_user.style.color = '#009432';
                } else {
                    R_user.style.color = 'red';
                }
                content[0].value = content[2].value,
                    content[1].value = content[3].value
            }
        })
    }
}